{% extends "base.html" %}
{# Copyright The IETF Trust 2015-2020, All Rights Reserved #}
{% load origin %}
{% load static %}
{% load ietf_filters %}
{% load django_bootstrap5 %}
{% block title %}{{ schedule.name }}: IETF {{ meeting.number }} meeting agenda{% endblock %}
{% block js %}
    <script src="{% static 'ietf/js/edit-meeting-timeslots-and-misc-sessions.js' %}"></script>
{% endblock %}
{% block content %}
    <h1>
        IETF {{ meeting.number }} meeting agenda
        <br>
        <small class="text-body-secondary">{{ schedule.name }}</small>
    </h1>
    {% origin %}
    <div class="my-3 edit-meeting-timeslots-and-misc-sessions {% if not can_edit %}read-only{% endif %}"
         {% if scroll %}data-scroll="{{ scroll }}"{% endif %}>
        <a class="btn btn-primary"
           href="{% url "ietf.meeting.views.list_schedules" num=meeting.number %}">Other Agendas</a>
        <p class="alert alert-info my-3">
            Meeting timeslots and misc. sessions for agenda: {{ schedule.name }}
            {% if not can_edit %}<em>(you do not have permission to edit timeslots)</em>{% endif %}
        </p>
        <div class="day-grid">
            {% for day in day_grid %}
                <div class="day">
                    <div class="day-label">
                        <strong>{{ day.day|date:"l" }}</strong>
                        {{ day.day|date:"N j, Y" }}
                    </div>
                    {% for room, timeslots in day.room_timeslots %}
                        <div class="room-row"
                             data-room="{{ room.pk }}"
                             data-day="{{ day.day.isoformat }}">
                            <div class="room-label" title="{{ room.name }}">
                                <strong>{{ room.name }}</strong>
                                {% if room.capacity %}<span class="badge rounded-pill text-bg-secondary">{{ room.capacity }}</span>{% endif %}
                            </div>
                            <div class="timeline">
                                <!-- [html-validate-disable-block no-inline-style -- FIXME: should style this better] -->
                                {% for t in timeslots %}
                                    <div id="timeslot{{ t.pk }}"
                                         class="timeslot"
                                         style="left: {{ t.left_offset|floatformat }}%;
                                                width: {{ t.layout_width|floatformat }}%;">
                                        {% for s in t.assigned_sessions %}
                                            <span class="session {% if s.current_status == 'canceled' or s.current_status == 'resched' %}cancelled{% endif %}">
                                                {% if s.name %}
                                                    {{ s.name }}
                                                    {% if s.group %}({{ s.group.acronym }}){% endif %}
                                                {% elif s.group %}
                                                    {{ s.group.acronym }}
                                                {% endif %}
                                            </span>
                                        {% empty %}
                                            {% if t.type_id == 'regular' %}
                                                (session)
                                            {% elif t.name  %}
                                                {{ t.name }}
                                            {% else %}
                                                {{ t.type.name }}
                                            {% endif %}
                                        {% endfor %}
                                        <span class="time-label">{{ t.time|date:"G:i" }}-{{ t.end_time|date:"G:i" }}</span>
                                    </div>
                                {% endfor %}
                            </div>
                        </div>
                    {% endfor %}
                </div>
            {% endfor %}
        </div>
        <div class="add-timeslot-template d-none">
            {% include "meeting/edit_timeslot_form.html" with timeslot_form_action='add' timeslot_form=empty_timeslot_form %}
        </div>
        <div class="scheduling-panel {% if not edit_timeslot_form and not add_timeslot_form %}d-none{% endif %}">
            <i class="close bi bi-x float-end"></i>
            <div class="panel-content">
                {% if edit_timeslot_form %}
                    {% include "meeting/edit_timeslot_form.html" with timeslot_form_action='edit' timeslot_form=edit_timeslot_form %}
                {% elif add_timeslot_form %}
                    {% include "meeting/edit_timeslot_form.html" with timeslot_form_action='add' timeslot_form=add_timeslot_form %}
                {% endif %}
            </div>
        </div>
    </div>
{% endblock %}